<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <title>登陆</title>
    <link rel="stylesheet" href="../style.css"/>

    <link rel="stylesheet" href="../plugins/elementui/index.css">
    <link rel="stylesheet" href="../plugins/font-awesome/css/font-awesome.min.css">
    <style>
        .ttt {
            text-align: center;
        }

        .box {
        // margin-left: 1000px; width: 470px;
            height: 470px;
            background-image: url("../xk.gif");
            background-repeat: no-repeat;
        }

        #root {
            width: 1000px;
        }
    </style>


</head>

<body>

<div id="app" class="box" style="background-color: pink; ">
    <center>

        <h1 style="text-align: center">学生登陆</h1>
        <div class="input-box">
            <label>学号</label>
            <input type="text" name="username" v-model="student.sno"/>
        </div>
        <div class="input-box">
            <label>密码</label>
            <input type="password" name="password" id="password" v-model="student.password"/>

        </div>
        <div class="btn-box">
            <a href="#">忘记密码?</a>
            <div>
                <button id="login" @click="login()">登录</button>
                <!--      <a id="regist" href="./zhuce.html" >注册</a>-->
            </div>
        </div>


    </center>
</div>


<script type="text/javascript" src="https://cdn.bootcss.com/canvas-nest.js/1.0.1/canvas-nest.min.js"></script>

</body>
<script src="../js/vue.js"></script>

<script src="../plugins/elementui/index.js"></script>

<script type="text/javascript" src="../js/jquery.min.js"></script>

<script src="../js/axios-0.18.0.js"></script>
<script>
    new Vue({
        el: '#app',
        data: {
            student: {
                sno: undefined,
                password: undefined
            }
        },
        methods: {
            login() {
                axios.post("http://localhost/login",this.student).then((res)=>{
                    if (res.data.errMsg!=null){
                        this.$message.error(res.data.errMsg);
                        return;
                    }
                    window.location.href='/xu/pages/myself.html'
                })
            },

        }
    })
</script>
</html>